<script type="text/ng-template" id="dataelement-details.html">
    <table class="table table-bordered">
        <tr>
            <td class="bold">{{'description' | translate}}</td>
            <td>{{content.displayDescription ? content.displayDescription : content.description ? content.description : 'not_available' | translate}}</td>
        </tr>
        <tr>
            <td class="bold">{{'url' | translate}}</td>
            <td>
                <span ng-if="content.url">
                    <a href="{{content.url}}" target="_blank">{{content.url}}</a>
                </span>
                <span ng-if="!content.url">
                    {{'not_available' | translate}}
                </span>
            </td>
        </tr>
    </table>
</script>
<form name="outerDataEntryForm" novalidate>
    <div ng-show="showLoadingEventSpinner" style="text-align:center;"><i class="fa fa-spinner fa-spin fa-3x"></i></div>
    <div ng-if="currentEvent" ng-hide="showLoadingEventSpinner">
        <div ng-include="'components/dataentry/event-details.html'"></div>
        <!-- data entry form begins -->
        <div ng-if="currentEvent.eventDate">
            <div class="clear vertical-spacing" ng-if="displayCustomForm === 'CUSTOM'" ng-include="'../dhis-web-commons/angular-forms/custom-dataentry-form.html'"></div>
            <div class="clear vertical-spacing" ng-if="displayCustomForm === 'DEFAULT'" ng-include="'components/dataentry/default-form.html'"></div>
        </div>
        <!-- the table form is insensitive to the event date being present. In this situation the eventdate is set inside the table form -->
        <div class="clear vertical-spacing" ng-if="displayCustomForm === 'TABLE'" ng-include="'components/dataentry/table-entry-form.html'"></div>        
        <!-- compare form -->        
        <div class="clear vertical-spacing" ng-if="displayCustomForm === 'COMPARE'" ng-include="'components/dataentry/compare-form.html'"></div>
        <!-- data entry form ends -->
        <!-- data entry/event buttons begins -->
        <div ng-include="'components/dataentry/dataentry-buttons.html'"></div>
        <!-- data entry/event buttons ends -->
    </div>
</form>
